<template>
<div>


  <div @click="slideLeft" id="slide-over-bg" class="absolute  z-20 inset-0 bg-gray-500 bg-opacity-75 transition-opacity md:hidden" ></div>
  <div   id="slide-over-box" class=" fixed  bg-gray-800 w-60 min-h-screen h-full text-gray-300 z-30   left-0 top-0 pl-3 pt-14 ">
   
    <ul class="menu py-3 bg-gray-800 shadow-lg  ">
         

        <li>
          <a href="/">
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-5 h-5 mr-2 stroke-current">        
             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
            </svg>
               Home
              
          </a>
        </li> 
        <li>
          <a href="/ski-resort">
             
            <svg class="inline-block w-5 h-5 mr-2 stroke-current" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4500" width="200" height="200"><path d="M512 960C264.576 960 64 759.424 64 512S264.576 64 512 64s448 200.576 448 448-200.576 448-448 448z m0-853.333333C288.149333 106.666667 106.666667 288.149333 106.666667 512s181.482667 405.333333 405.333333 405.333333 405.333333-181.482667 405.333333-405.333333S735.850667 106.666667 512 106.666667z m341.333333 426.666666h-21.333333a21.333333 21.333333 0 1 1 0-42.666666h21.333333a21.333333 21.333333 0 1 1 0 42.666666z m-128.448 175.018667a20.138667 20.138667 0 0 1-5.568 10.965333 20.778667 20.778667 0 0 1-24.085333 3.669334l1.237333 1.258666 0.170667 0.170667c-3.456-1.429333-6.528-2.773333-9.898667-4.16-110.698667-46.122667-175.210667-82.261333-210.496-105.344-28.010667-18.304-37.866667-28.437333-38.272-28.864-0.96-0.917333-53.077333-51.456-138.346666-258.666667h0l1.429333 1.429334c-0.213333-0.426667-0.256-0.896-0.426667-1.322667a20.586667 20.586667 0 0 1-0.810666-14.101333 19.882667 19.882667 0 0 1 4.885333-8.682667 20.629333 20.629333 0 0 1 23.488-3.861333c0.192 0.085333 0.426667 0.106667 0.597333 0.213333l-0.490666-0.533333-0.917334-0.896h0.021334-0.021334c207.210667 85.269333 257.749333 137.386667 258.666667 138.346666 0.96 0.917333 53.077333 51.477333 138.346667 258.666667l-0.021334-0.021333 0.021334 0.021333-0.938667-0.938667-0.490667-0.469333c0.490667 1.002667 0.682667 2.069333 1.024 3.114667a21.034667 21.034667 0 0 1 0.896 10.005333z m-169.237333-240.448c-0.448-0.448-43.008-41.109333-195.989333-108.224 67.114667 152.981333 107.84 195.562667 108.693333 196.437333 0.448 0.448 43.008 41.130667 195.989333 108.224-67.114667-153.002667-107.84-195.562667-108.693333-196.437333zM512 490.666667a21.333333 21.333333 0 1 1 0 42.666666 21.333333 21.333333 0 1 1 0-42.666666z m0-277.333334a21.333333 21.333333 0 0 1-21.333333-21.333333V170.666667a21.333333 21.333333 0 1 1 42.666666 0v21.333333a21.333333 21.333333 0 0 1-21.333333 21.333333z m0 597.333334a21.333333 21.333333 0 0 1 21.333333 21.333333v21.333333a21.333333 21.333333 0 1 1-42.666666 0v-21.333333a21.333333 21.333333 0 0 1 21.333333-21.333333zM192 533.333333H170.666667a21.333333 21.333333 0 1 1 0-42.666666h21.333333a21.333333 21.333333 0 1 1 0 42.666666z" fill="#cdcdcd" p-id="4501"></path></svg>
             Ski Reports 
            <!-- <div class="badge ml-2 success">3</div> -->
          </a>
        </li>

        <li>
          <a href="/community">
              <svg   class="inline-block w-5 h-5 mr-2 stroke-current" viewBox="0 0 1026 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5413" width="200" height="200"><path d="M441.571072 263.68m-84.48 0a3.3 3.3 0 1 0 168.96 0 3.3 3.3 0 1 0-168.96 0Z" p-id="5414" fill="#dbdbdb"></path><path d="M280.291072 537.6m-48.64 0a1.9 1.9 0 1 0 97.28 0 1.9 1.9 0 1 0-97.28 0Z" p-id="5415" fill="#dbdbdb"></path><path d="M664.291072 775.68m-33.28 0a1.3 1.3 0 1 0 66.56 0 1.3 1.3 0 1 0-66.56 0Z" p-id="5416" fill="#dbdbdb"></path><path d="M940.771072 235.52c5.12-7.68 10.24-15.36 15.36-23.04 20.48-38.4 53.76-97.28 35.84-151.04-10.24-25.6-28.16-38.4-40.96-43.52-46.08-15.36-107.52 23.04-117.76 30.72-12.8 7.68-15.36 23.04-7.68 35.84 7.68 12.8 23.04 15.36 35.84 7.68 20.48-12.8 56.32-30.72 74.24-23.04 2.56 0 5.12 2.56 7.68 10.24 10.24 30.72-15.36 76.8-33.28 110.08-43.52 79.36-102.4 151.04-161.28 225.28-138.24 168.96-296.96 312.32-486.4 435.2-7.68 5.12-15.36 10.24-25.6 15.36-102.4-81.92-168.96-209.92-168.96-353.28 0-250.88 202.24-453.12 453.12-453.12 56.32 0 107.52 10.24 156.16 28.16l0 0c2.56 0 5.12 2.56 7.68 2.56 15.36 0 25.6-10.24 25.6-25.6 0-10.24-7.68-20.48-17.92-23.04-53.76-20.48-112.64-30.72-174.08-30.72C241.891072 7.68 16.611072 232.96 16.611072 512c0 87.04 23.04 168.96 61.44 240.64-10.24 15.36-46.08 64-69.12 120.32-15.36 35.84-10.24 69.12 10.24 92.16 15.36 17.92 40.96 28.16 69.12 28.16 10.24 0 23.04-2.56 33.28-5.12 40.96-12.8 79.36-35.84 112.64-58.88 81.92 56.32 179.2 89.6 286.72 89.6C799.971072 1016.32 1025.251072 791.04 1025.251072 512 1025.251072 409.6 994.531072 314.88 940.771072 235.52zM106.211072 936.96c-17.92 5.12-38.4 2.56-48.64-7.68-10.24-10.24-5.12-25.6-2.56-38.4 15.36-35.84 35.84-71.68 51.2-92.16 25.6 35.84 53.76 66.56 84.48 94.72C165.091072 911.36 136.931072 926.72 106.211072 936.96zM520.931072 965.12c-87.04 0-168.96-25.6-238.08-69.12 2.56-2.56 5.12-2.56 7.68-5.12 192-125.44 355.84-271.36 496.64-445.44 43.52-53.76 84.48-104.96 122.88-161.28 38.4 66.56 64 145.92 64 227.84C974.051072 762.88 771.811072 965.12 520.931072 965.12z" p-id="5417" fill="#dbdbdb"></path></svg>
             Community 
            <!-- <div class="badge ml-2 success">3</div> -->
          </a>
        </li>

         <li>
          <a><label class=" cursor-pointer"  :for="$store.state.user.uid>0?'my-modal-topic':'SnogogologinBox'">
            <svg xmlns="http://www.w3.org/2000/svg" class="inline-block w-5 h-5 mr-2 stroke-current" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" />
             </svg>
             New Topic 
            <!-- <div class="badge ml-2 success">3</div> -->
          </label></a>
        </li>
    </ul>

     
            <ul v-if="$store.state.user.uid" role="list" class=" text-sm font-medium text-gray-300 space-y-4 p-5  ">
              
               <li>
                <a href="/dashboard/my-likes">
                   <svg   t="1641192768302" class="h-5 w-5 inline-block  " viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12280" width="200" height="200"><path d="M511.913993 928.016126c-28.898371 0-57.968755-12.729044-86.695112-41.455401L106.30472 564.034268C68.117588 516.38636 31.994625 471.318663 31.994625 383.935495c0-141.223585 114.905426-255.956996 255.956996-255.956996 53.15236 0 104.068537 16.169326 147.244079 46.615824 14.449185 10.148833 17.889467 30.102469 7.740635 44.551655-10.148833 14.449185-30.102469 17.889467-44.551655 7.740635-32.338653-22.877877-70.525785-34.918864-110.433059-34.918864-105.960692 0-191.967747 86.179069-191.967747 191.967747 0 61.409037 20.297665 90.135394 59.172854 138.643373l315.645893 318.742147c15.997312 15.997312 28.898371 22.361834 41.283387 22.533848 12.729044 0.172014 24.942046-6.192508 41.455401-22.705863l316.677977-319.946246c25.974131-28.210314 57.968755-75.858223 57.968755-137.439274 0-105.960692-86.179069-191.967747-191.967747-191.967747-47.991937 0-94.091718 17.889467-129.526625 50.22812l-133.998992 134.171006c-12.55703 12.55703-32.682681 12.55703-45.239711 0s-12.55703-32.682681 0-45.239711l135.031077-135.203091c48.335965-44.207626 109.745003-67.945574 173.734252-67.945574 141.223585 0 255.956996 114.905426 255.956996 255.956996 0 82.394759-41.111372 144.319839-75.686209 181.646901L598.781119 886.388712C569.882748 915.287082 540.984378 928.016126 511.913993 928.016126z" p-id="12281" fill="#dbdbdb"></path></svg>
                   My Likes
                </a>
              </li>

               <!-- <li>
                <a href="/dashboard/bookmarks">
                  <svg t="1641200070037" class="w-5 h-5 inline-block pr-1" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13421" width="200" height="200"><path d="M640 928c-158.4 0-288-129.6-288-288s129.6-288 288-288 288 129.6 288 288-129.6 288-288 288z m0-512c-123.2 0-224 100.8-224 224s100.8 224 224 224 224-100.8 224-224-100.8-224-224-224z" p-id="13422" fill="#e6e6e6"></path><path d="M592 750.4c-4.8 0-11.2-1.6-16-4.8-9.6-6.4-16-16-16-27.2v-156.8c0-11.2 6.4-22.4 16-27.2s22.4-6.4 32 0l136 78.4c9.6 6.4 16 16 16 27.2s-6.4 22.4-16 27.2l-136 80c-4.8 1.6-11.2 3.2-16 3.2z m32-134.4v46.4l40-24-40-22.4zM256 512H128c-17.6 0-32-14.4-32-32s14.4-32 32-32h128c17.6 0 32 14.4 32 32s-14.4 32-32 32zM256 832H128c-17.6 0-32-14.4-32-32s14.4-32 32-32h128c17.6 0 32 14.4 32 32s-14.4 32-32 32zM896 192H128c-17.6 0-32-14.4-32-32s14.4-32 32-32h768c17.6 0 32 14.4 32 32s-14.4 32-32 32z" p-id="13423" fill="#e6e6e6"></path></svg>
                  Bookmarks
                </a>
              </li> -->


              <li>
                <a href="/dashboard/notifications">
                  <svg t="1641200575984" class="w-5 h-5 inline-block pr-1" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="14395" width="200" height="200"><path d="M514.048 75.1616c-242.1248 0-439.1424 197.0176-439.1424 439.1424s197.0176 439.1424 439.1424 439.1424 439.1424-197.0176 439.1424-439.1424-197.0176-439.1424-439.1424-439.1424z m0 816.8448c-208.2816 0-377.7024-169.4208-377.7024-377.7024 0-208.2816 169.4208-377.7024 377.7024-377.7024s377.7024 169.4208 377.7024 377.7024c0 208.2816-169.4208 377.7024-377.7024 377.7024z" fill="#dbdbdb" p-id="14396"></path><path d="M514.048 787.0464c-132.1984 0-243.0464-94.976-267.6224-220.3136l42.8544 21.6064 27.648-54.8864-91.1872-45.9264a31.72864 31.72864 0 0 0-30.8736 1.3824 31.77472 31.77472 0 0 0-14.9504 26.9824c0.8192 183.3984 150.7328 332.5952 334.1824 332.5952 90.9824 0 176.0256-35.8912 239.4624-101.12l-44.032-42.8544c-51.8656 53.248-121.2416 82.5344-195.4816 82.5344zM514.048 180.1728c-87.1936 0-169.6768 33.3824-232.2944 93.952l42.7008 44.1856c51.0976-49.4592 118.4256-76.6976 189.5936-76.6976 133.0688 0 244.5312 96.2048 268.1344 222.8224l-56.3712-25.7536-25.5488 55.8592 103.0144 47.104c4.2496 1.9968 8.8064 2.9696 13.312 2.9696 5.9392 0 11.8784-1.6896 17.0496-5.0688a31.3344 31.3344 0 0 0 14.4896-26.7264c-0.7168-183.4496-150.6304-332.6464-334.08-332.6464z" fill="#dbdbdb" p-id="14397"></path><path d="M406.6816 548.3008v61.44h71.2192v32.3072h61.44v-32.3072h71.168v-61.44h-71.168v-31.232h71.168v-61.44h-44.9024l30.9248-37.1712-47.2576-39.2704-42.9568 51.6608-45.7216-49.8688-45.312 41.5232 30.4128 33.1264h-39.0144v61.44h71.2192v31.232z" fill="#dbdbdb" p-id="14398"></path></svg>
                  Notifications
                </a>
              </li>

              

              <li>
                <a href="/dashboard/posts">
                  <svg t="1641200676458" class="w-5 h-5 inline-block pr-1" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16250" width="200" height="200"><path d="M170.666667 896v0.021333c-0.426667 0.021333 0 0.426667 0 2.069334C170.666667 896.426667 170.24 896 170.666667 896z m682.666666-607.488V896H170.666667V170.666667h554.666666V128H170.474667C147.178667 128 128 146.176 128 168.576v729.514667C128 920.448 147.114667 938.666667 170.666667 938.666667h682.666666c23.68 0 42.666667-18.218667 42.666667-40.661334v-609.493333h-42.666667zM618.474667 519.701333a21.312 21.312 0 0 0 29.226666-7.530666l245.333334-416a21.354667 21.354667 0 0 0-36.757334-21.674667l-245.333333 416a21.333333 21.333333 0 0 0 7.530667 29.226667zM298.666667 384.021333h298.666666v-42.666666H298.666667v42.666666z m0 128h170.666666v-42.666666h-170.666666v42.666666z" fill="#dbdbdb" p-id="16251"></path></svg>
                  Posts
                </a>
              </li>

               <li>
                <a :href="'/uid/'+$store.state.user.uid">
                  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-5 h-5   stroke-current">        
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
                  </svg>
                  Your Profile
                </a>
              </li>

              

              
            </ul>
  </div>
        
</div>
</template>
<script>
export default {
   
methods: {
     slideLeft(){
       //console.log("showBigSlideMenu:",this)
       this.$emit('showBigSlideMenu');
     }
    
     
   }

}
</script>